<template>
  <div>
    <el-table :data="tableData" :show-header="showHeader" :class="showHeader ? 'has-bg' : ''">
      <el-table-column align="left" prop="projectName" label="" :min-width="130">
        <template slot-scope="scope">
          <span v-if="scope.row.projectKey && scope.row.projectKey != 'group'" class="cursor-pointer-line padding-left-10" @click="goInfo(scope.row, 'other', 0)">{{ scope.row.projectName }}</span>
          <span v-else class="cursor-pointer-line padding-left-10" @click="goInfo(scope.row, 'other', 0)">{{ scope.row.projectName }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" class-name="head1">
        <template #header>
          <span>{{ txt1 }}</span>
          <span v-tooltip="txt1" class="icon el-icon-question padding-left-5"></span>
        </template>
        <el-table-column v-if="dialogType == 1 || dialogType == 3 || dialogType == 5" align="center" label="年度计划">
          <template slot-scope="scope">
            <span class="cursor-pointer-line" @click="goInfo(scope.row, 'plan', 'home')">{{ scope.row.yearPlanAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" :label="planTxt">
          <template slot-scope="scope">
            <span class="cursor-pointer-line" @click="goInfo(scope.row, 'plan', 0)">{{ scope.row.planAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" :label="executeTxt">
          <template slot-scope="scope">
            <span class="cursor-pointer-line" @click="goInfo(scope.row, 'other', 0)">{{ scope.row.executionAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="差异" width="140">
          <template slot-scope="scope">
            <div class="cursor-pointer-line" :class="diffClassName(scope.row.deviationAmount)">
              <span @click="goInfo(scope.row, 'other', 0)" :class="diffClassName(scope.row.deviationAmount)">{{ scope.row.deviationAmount | moneyFilterNoUnit }}</span>
              <span v-if="scope.row.deviationRate == '--' || scope.row.deviationRate == '计划外'" @click="goInfo(scope.row, 'other', 0)" class="color-666666">（{{ scope.row.deviationRate }}）</span>
              <span v-else @click="goInfo(scope.row, 'other', 0)" :class="diffClassName(scope.row.deviationRate)">（{{ scope.row.deviationRate || 0 | accMul }}%）</span>
            </div>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column align="center" class-name="head2">
        <template #header>
          <span>{{ txt2 }}</span>
          <span v-tooltip="txt2" class="icon el-icon-question padding-left-5"></span>
        </template>
        <el-table-column align="center" :label="planTxt">
          <template slot-scope="scope">
            <span class="cursor-pointer-line" @click="goInfo(scope.row, 'plan', 1)">{{ scope.row.operationPlanAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" :label="executeTxt">
          <template slot-scope="scope">
            <span class="cursor-pointer-line" @click="goInfo(scope.row, 'other', 1)">{{ scope.row.operationExecutionAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="差异" width="140">
          <template slot-scope="scope">
            <div class="cursor-pointer-line" :class="diffClassName(scope.row.operationDeviationAmount)">
              <span @click="goInfo(scope.row, 'other', 1)" :class="diffClassName(scope.row.operationDeviationAmount, 'income')">{{ scope.row.operationDeviationAmount | moneyFilterNoUnit }}</span>
              <span v-if="scope.row.operationDeviationRate == '--' || scope.row.operationDeviationRate == '计划外'" class="color-666666">（{{ scope.row.operationDeviationRate }}）</span>
              <span v-else @click="goInfo(scope.row, 'other', 1)" :class="diffClassName(scope.row.operationDeviationRate, 'income')">（{{ scope.row.operationDeviationRate | accMul }}%）</span>
            </div>
          </template>
        </el-table-column>
      </el-table-column>
      <el-table-column align="center" class-name="head3">
        <template #header>
          <span>{{ txt3 }}</span>
          <span v-tooltip="txt3" class="icon el-icon-question padding-left-5"></span>
        </template>
        <el-table-column align="center" :label="planTxt">
          <template slot-scope="scope">
            <span class="cursor-pointer-line" @click="goInfo(scope.row, 'plan', 2)">{{ scope.row.nonOperationPlanAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" :label="executeTxt">
          <template slot-scope="scope">
            <span class="cursor-pointer-line" @click="goInfo(scope.row, 'other', 2)">{{ scope.row.nonOperationExecutionAmount | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" label="差异" width="140">
          <template slot-scope="scope">
            <div class="cursor-pointer-line" :class="diffClassName(scope.row.nonOperationDeviationAmount)">
              <span @click="goInfo(scope.row, 'other', 2)" :class="diffClassName(scope.row.nonOperationDeviationAmount, 'pay')">{{ scope.row.nonOperationDeviationAmount | moneyFilterNoUnit }}</span>
              <span v-if="scope.row.nonOperationDeviationRate == '--' || scope.row.nonOperationDeviationRate == '计划外'" class="color-666666">（{{ scope.row.nonOperationDeviationRate }}）</span>
              <span v-else @click="goInfo(scope.row, 'other', 2)" :class="diffClassName(scope.row.nonOperationDeviationRate, 'pay')">（{{ scope.row.nonOperationDeviationRate | accMul }}%）</span>
            </div>
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
  import { goOperationIndex } from '@/common/js/utils';

  import dayjs from 'dayjs';

  export default {
    props: {
      dialogType: {
        type: Number,
        default: 1,
      },
      fiscalYear: {
        type: String,
        default: '',
      },
      fiscalMonth: {
        type: Number,
        default: 1,
      },
      showHeader: {
        type: Boolean,
        default: false,
      },
      tableData: {
        type: Array,
        default: () => {
          return [];
        },
      },
      clickMonth: {
        type: Number,
        default: 1,
      },
    },

    computed: {
      //以下三个txt对应的list是不同类型弹框的三个header汉字
      txt1() {
        let list = ['现金流入（累计）', '现金流入（全年预测）', '支出（累计）', '支出（全年预测）', '净现金流（累计）', '净现金流（全年预测）', '净现金流', '净利润（累计）'];
        return list[this.dialogType - 1];
      },
      txt2() {
        // let list = ['经营活动现金流入（累计）', '经营活动现金流入（全年预测）', '经营活动支出（累计）', '经营活动支出（全年预测）', '经营活动净现金流（累计）', '经营活动净现金流（全年预测）', '收入', '累计收入（累计）'];
        let list = ['经营活动现金流入（累计）', '经营活动现金流入（全年预测）', '经营活动支出（累计）', '经营活动支出（全年预测）', '现金流入（累计）', '现金流入（全年预测）', '现金流入', '累计收入（累计）'];
        return list[this.dialogType - 1];
      },
      txt3() {
        // let list = ['非经营活动现金流入（累计）', '非经营活动现金流入（全年预测）', '非经营活动支出（累计）', '非经营活动支出（全年预测）', '非经营活动净现金流（累计）', '非经营活动净现金流（全年预测）', '支出', '累计支出（累计）'];
        let list = ['非经营活动现金流入（累计）', '非经营活动现金流入（全年预测）', '非经营活动支出（累计）', '非经营活动支出（全年预测）', '支出（累计）', '支出（全年预测）', '支出', '累计支出（累计）'];
        return list[this.dialogType - 1];
      },
      diffClassName() {
        return function (val, type) {
          if (this.dialogType == 3 || this.dialogType == 4) {
            return val > 0 ? 'color-red' : 'color-green';
          } else if (this.dialogType == 8 || this.dialogType == 5 || this.dialogType == 6 || this.dialogType == 7) {
            if (type == 'pay') {
              return val > 0 ? 'color-red' : 'color-green';
            } else {
              return val < 0 ? 'color-red' : 'color-green';
            }
          } else {
            return val < 0 ? 'color-red' : 'color-green';
          }
        };
      },
      planTxt() {
        if (this.dialogType == 1 || this.dialogType == 3 || this.dialogType == 5 || this.dialogType == 7) {
          return '计划执行';
        } else {
          return '计划';
        }
      },
      executeTxt() {
        if (this.dialogType == 1 || this.dialogType == 3 || this.dialogType == 5 || this.dialogType == 7) {
          return '实际执行';
        } else {
          return '执行';
        }
      },
    },

    data() {
      return {
        isIncome: false,
        showDialog: false,
        goOperationIndex: goOperationIndex,
      };
    },

    methods: {
      getPathName(colIndex, incomeName, payName) {
        let pathName = '';
        let manage = '';
        // 累计现金流入  全年现金流入预测
        if (this.dialogType == 2) {
          pathName = incomeName;
          manage = colIndex == 2 ? 'noOperate' : 'operate';
        } else if (this.dialogType == 4) {
          // 累计支出  全年支出预测
          pathName = payName;
          manage = colIndex == 2 ? 'noOperate' : 'operate';
        } else if (this.dialogType == 6) {
          // 累计净现金流  全年净现金流预测  月净现金流
          pathName = colIndex == 2 ? payName : incomeName;
          manage = 'operate';
        }

        return {
          pathName,
          manage,
        };
      },

      goInfo(row, type, colIndex) {
        let pathName = '';
        let planName = '';
        let planProjectName = '';
        let manage = '';

        if (this.dialogType != 1 && this.dialogType != 3 && this.dialogType != 5 && this.dialogType != 7) {
          if (type == 'plan') {
            if (row.projectKey && row.projectKey != 'group') {
              let pathData = this.getPathName(colIndex, 'compile-income-plan', 'compile-pay-plan');
              pathName = pathData.pathName;
              manage = pathData.manage;
              planName = '项目计划'; //编制
              planProjectName = row.projectName;

              if (this.dialogType == 8) {
                pathName = 'compile-profit';
                manage = '';
              }
            } else {
              let pathData = this.getPathName(colIndex, 'year-income-plan', 'year-pay-plan');
              pathName = pathData.pathName;
              manage = pathData.manage;
              planName = '集团计划'; //年度
              planProjectName = '集团';

              if (this.dialogType == 8) {
                pathName = 'year-profit';
                manage = '';
              }
            }
          } else {
            if (row.projectKey && row.projectKey != 'group') {
              let pathData = this.getPathName(colIndex, 'execute-income-plan', 'execute-pay-plan');
              pathName = pathData.pathName;
              manage = pathData.manage;
              planName = '项目月报'; //项目月报
              planProjectName = row.projectName;

              if (this.dialogType == 8) {
                pathName = 'execute-profit';
                manage = '';
              }
            } else {
              let pathData = this.getPathName(colIndex, 'groupmonth-income-plan', 'groupmonth-pay-plan');
              pathName = pathData.pathName;
              manage = pathData.manage;
              planName = '集团月报'; //集团月报
              planProjectName = '集团';

              if (this.dialogType == 8) {
                pathName = 'groupmonth-profit';
                manage = '';
              }
            }
          }
        } else {
          this.goInfoNew(row, type, colIndex);
          return;
        }

        let queryData = {
          headerName: planName,
          year: this.fiscalYear || '',
          month: type == 'plan' ? '' : this.dialogType == 7 ? this.clickMonth : this.fiscalMonth,
          planProjectName: planProjectName,
        };

        if (row.projectKey && row.projectKey != 'group') {
          queryData.projectKey = row.projectKey;
        }

        // 权责跳转到利润表
        if (manage) {
          queryData.manage = manage;
        }

        let pathUrl = {
          name: pathName,
          query: queryData,
        };

        let { href } = this.$router.resolve(pathUrl);
        window.open(href);
      },

      goInfoNew(row, type, colIndex) {
        let pathName = '';
        let planName = '';
        let planProjectName = '';
        let manage = '';
        let month = '';
        let classifyKey = '';

        if (this.dialogType == 1 || this.dialogType == 3) {
          if (row.projectKey && row.projectKey != 'group') {
            if (type == 'plan' && colIndex == 'home') {
              pathName = 'compile-all-plan';
              planName = '项目计划';
              planProjectName = row.projectName;
            } else {
              month = this.fiscalMonth;
              pathName = this.dialogType == 1 ? 'execute-income-plan' : 'execute-pay-plan';
              planName = '项目月报';
              planProjectName = row.projectName;
            }
          } else {
            if (type == 'plan' && colIndex == 'home') {
              pathName = 'year-all-plan';
              planName = '集团计划';
              planProjectName = '集团';
            } else {
              month = this.fiscalMonth;
              pathName = this.dialogType == 1 ? 'groupmonth-income-plan' : 'groupmonth-pay-plan';
              planName = '集团月报';
              planProjectName = '集团';
            }
          }
          manage = colIndex == 2 ? 'noOperate' : 'operate';
        } else if (this.dialogType == 5) {
          if (row.projectKey && row.projectKey != 'group') {
            if (type == 'plan' && colIndex == 'home') {
              pathName = 'compile-all-plan';
              planName = '项目计划';
              planProjectName = row.projectName;
            } else if ((type == 'other' || type == 'plan') && colIndex == 0) {
              month = this.fiscalMonth;
              pathName = 'execute-all-plan';
              planName = '项目月报';
              planProjectName = row.projectName;
            } else {
              month = this.fiscalMonth;
              pathName = colIndex == 1 ? 'execute-income-plan' : 'execute-pay-plan';
              planName = '项目月报';
              planProjectName = row.projectName;
            }
          } else {
            if (type == 'plan' && colIndex == 'home') {
              pathName = 'year-all-plan';
              planName = '集团计划';
              planProjectName = '集团';
            } else if ((type == 'other' || type == 'plan') && colIndex == 0) {
              month = this.fiscalMonth;
              pathName = 'groupmonth-all-plan';
              planName = '集团月报';
              planProjectName = row.projectName;
            } else {
              month = this.fiscalMonth;
              pathName = colIndex == 1 ? 'groupmonth-income-plan' : 'groupmonth-pay-plan';
              planName = '集团月报';
              planProjectName = '集团';
            }
          }
          manage = colIndex == 2 ? 'noOperate' : 'operate';
        } else if (this.dialogType == 7) {
          if (row.projectKey && row.projectKey != 'group') {
            if (type == 'plan') {
              pathName = 'compile-all-plan';
              planName = '项目计划';
              planProjectName = row.projectName;
            } else if (type == 'other') {
              month = this.clickMonth;
              if (colIndex == 0) {
                pathName = 'execute-all-plan';
                planName = '项目月报';
                planProjectName = row.projectName;
              } else {
                pathName = colIndex == 1 ? 'execute-income-plan' : 'execute-pay-plan';
                classifyKey = 'month';
                planName = '项目月报';
                planProjectName = row.projectName;
              }
            }
          } else {
            if (type == 'plan') {
              pathName = 'year-all-plan';
              planName = '集团计划';
              planProjectName = '集团';
            } else if (type == 'other') {
              month = this.clickMonth;
              if (colIndex == 0) {
                pathName = 'groupmonth-all-plan';
                planName = '集团月报';
                planProjectName = row.projectName;
              } else {
                pathName = colIndex == 1 ? 'groupmonth-income-plan' : 'groupmonth-pay-plan';
                classifyKey = 'month';
                planName = '集团月报';
                planProjectName = row.projectName;
              }
            }
          }
        }

        let queryData = {
          headerName: planName,
          year: this.fiscalYear || '',
          planProjectName: planProjectName,
        };

        if (month) queryData.month = month;
        if (classifyKey) queryData.classifyKey = classifyKey;

        if (row.projectKey && row.projectKey != 'group') {
          queryData.projectKey = row.projectKey;
        }

        // 权责跳转到利润表
        if (manage) {
          queryData.manage = manage;
        }

        let pathUrl = {
          name: pathName,
          query: queryData,
        };

        let { href } = this.$router.resolve(pathUrl);
        window.open(href);
      },
    },
  };
</script>

<style lang="scss" scoped>
  ::v-deep .el-table {
    border: 1px solid #f1f1f1;
    .el-table__cell {
      border-right: 1px solid #f1f1f1;
    }
    .head1 {
      background: rgba(247, 145, 0, 0.25) !important;
    }
    .head2 {
      background: rgba(247, 145, 0, 0.1) !important;
    }
    .head3 {
      background: #fef4e5 !important;
    }
    .cell {
      padding: 0 !important;
    }
  }
  ::v-deep .has-bg {
    .el-table__body-wrapper {
      .el-table__row {
        background: rgba(51, 132, 254, 0.2);
      }
    }
  }
</style>
